<script lang="ts" setup>
</script>

<template>
  <div class="dataBlock">
    <div class="noImg">
      <img src="@/assets/images/noData_light.png" alt="" />
    </div>
    <div class="title">
      <slot name="title"></slot>
    </div>
    <div class="desc">
      <slot name="desc"></slot>
    </div>
  </div>
</template>

<style scoped lang="scss">
@import "@/assets/style/constant.scss";

.dataBlock {
  width: 432 * $_ru;
  padding: 96 * $_ru 0;
  margin: 0 auto;

  .noImg {
    margin: 0 auto;
    width: 200 * $_ru;
    height: 200 * $_ru;
    font-size: 0;

    > img {
      width: 100%;
      height: 100%;
      font-size: 0;
    }
  }

  .title {
    margin: 8 * $_ru 0;
    text-align: center;
    color: var(--1-icon, #1b202a);
    font-family: PingFang SC;
    font-size: 32 * $_ru;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
  }

  .desc {
    text-align: center;
    color: #999;
    font-family: PingFang SC;
    font-size: 24 * $_ru;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
  }
}
</style>
